<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link rel="stylesheet" type="text/css" href="../../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../../css/common.css" />
	<link rel="stylesheet" type="text/css" href="../../css/aui.css" />
  <title>学术</title>
  <style>
		html, body {width: 100%;min-height: 100%;background: #f0f0f0;}
    .h20 {height: 0.5rem;background: #f0f0f0;}

    .sqsb_con {}
    .ml_btns {
      position: fixed;
      bottom: 0;
      width: 100%;
    }
    .ml_btn {
      float: left;
      width: 100%;
      padding: 0.5rem 0;
      text-align: center;
      background: #2997e4;
      color: #fff;
    }
    .sqsb_con ul {
      background: #fff;
    }
    .sqsb_con ul li {
      font-size: 0.75rem;
      color: #999;
      padding: 0.75rem 1rem;
      line-height: 1.2rem;
    }
    .sqsb_con ul li span {
      float: right;
      color: #333;
    }
    .sqsb_con ul li input[type="text"] {
      border: none;
      float: right;
      color: #333;
      font-size: 0.75rem;
      position: relative;
      text-align: right;
      width: 50%;
      height: 1.2rem;
    }
    .sqsb_con p {
      background: #fff;
      padding: 0.75rem 1rem;
      margin: 1rem 0;
      font-size: 0.75rem;
      color: #999;
    }
    .sqsb_con p span {
      float: right;
      color: #2997e4;
      position: relative;
    }
    .sqsb_con p span input[type="file"]{
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      opacity: 0;
    }
    .sqsb_con ul li {
      border-bottom: 1px solid #f0f0f0;
    }
    .sqsb_con ul {
      margin-bottom: 3rem;
    }
	</style>
</head>
<body>
  <div id="app">
<div class="sqsb_con">
  <ul>
    <li>
      所属领域 <input type="text" v-model="domain">
    </li>
    <li>
      所属方向 <input type="text" v-model="direction">
    </li>
    <li>
      计划名称 <input type="text" v-model="plan_title">
    </li>
    <li>
      推荐单位 <input type="text" v-model="recommend_unit">
    </li>
    <li>
      申报单位 <input type="text" v-model="declare_unit">
    </li>
    <li>
      计划负责人 <input type="text" v-model="plan_leader">
    </li>
    <li>
      联系电话 <input type="text" v-model="telephone">
    </li>
    <li>
      电子邮箱 <input type="text" v-model="email">
    </li>
    <li>
      传真 <input type="text" v-model="fax">
    </li>
  </ul>
  <!-- <p>添加附件
    <span>
      点击上传
      <input type="file">
    </span>
  </p> -->
</div>
<div class="ml_btns">
  <div class="ml_btn" @click="sqsb()">
    提交
  </div>
</div>

</div>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/vue.min.js"></script>
<script type="text/javascript" src="../../script/utils.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script>
// 完成首页初始化
apiready = function(){
  var app = new Vue({
		el: '#app',
		data: {
      article_id: '',
      domain: '', //  所属领域
      direction: '', // 所属方向
      plan_title: '', // 计划名称
      recommend_unit: '', // 推荐单位
      declare_unit: '', // 申报单位
      plan_leader: '', // 计划负责人
      telephone: '', // 联系电话
      email: '', // 电子邮件
      fax: '', // 传真
      token: ''
		},
		created: function() {
      var $_this = this
      $_this.article_id = api.pageParam.id
      // console.log(api.pageParam.id)
      // console.log($api.getStorage('token'))
      $_this.token = $api.getStorage('token')
      if(!$api.getStorage('token')){
        api.confirm( {
            title: '是否登录',
            msg: '确认是否登录？',
            buttons: [ '确定', '取消' ]
          }, function ( ret, err ) {
            var index = ret.buttonIndex;
            if ( index == 1 ) {
              api.openWin({
                name: 'login',
                url: '../five_frame/login_header.html',
                delay: 200,
                bounces: false
              });
              return;
            } else {
              api.closeWin({
                  name: name
              });
              return
            }
          })
          return
        }
		},
		methods: {
      sqsb: function () {
        var $_this = this;
        if ($_this.domain == '') {
                  api.toast({ msg: '请输入所属领域',duration: 2000,location:'middle' });
          return
        } else if ($_this.direction == '') {
                  api.toast({ msg: '请输入所属方向',duration: 2000,location:'middle' });
          return
        } else if ($_this.plan_title == '') {
                  api.toast({ msg: '请输入计划名称',duration: 2000,location:'middle' });
          return
        } else if ($_this.recommend_unit == '') {
                  api.toast({ msg: '请输入推荐单位',duration: 2000,location:'middle' });
          return
        } else if ($_this.declare_unit == '') {
                  api.toast({ msg: '请输入申报单位',duration: 2000,location:'middle' });
          return
        } else if ($_this.plan_leader == '') {
                  api.toast({ msg: '请输入计划负责人',duration: 2000,location:'middle' });
          return
        } else if ($_this.telephone == '' || !/^[1][3,4,5,7,8][0-9]{9}$/.test($_this.telephone)) {
                  api.toast({ msg: '请输入正确的联系电话',duration: 2000,location:'middle' });
          return
        } else if ($_this.email == '' || !/^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test($_this.email)) {
                  api.toast({ msg: '请输入正确的邮箱',duration: 2000,location:'middle' });
          return
        } else if ($_this.fax == '' || !/^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/.test($_this.fax)) {
                  api.toast({ msg: '请输入正确的传真',duration: 2000,location:'middle' });
          return
        }
  			api.ajax({
  				url: window.Url.applyDeclare,
          method: 'post',
          headers: {
			        'Content-Type': 'application/json',
              'baseParams': $_this.token //token
          },
          data: {
            body: {
              article_id: $_this.article_id,
              domain: $_this.domain,
              direction: $_this.direction,
              plan_title: $_this.plan_title,
              recommend_unit: $_this.recommend_unit,
              declare_unit: $_this.declare_unit,
              plan_leader: $_this.plan_leader,
              telephone: $_this.telephone,
              email: $_this.email,
              fax: $_this.fax,
            }
          },
  				timeout: 300,
  			}, function(ret, err) {
  					if (ret) {
              // api.alert({ msg: JSON.stringify(ret) });
              if (ret.code == 2) {
                alert('用户未登录，请返回登录')
                $api.rmStorage('token')
                $api.rmStorage('data')
                goback()
                 return
              } else if (ret.code == 0) {
                  openSuccess('提交成功')
                } else {
                    api.alert({ msg: JSON.stringify(ret.message) });
                }
  					} else {
  							api.alert({ msg: JSON.stringify(err) });
  					}
  			})
      }
		}
	})
}
  function openDetail(type, title) {
    api.openWin({
      name: 'index_detail_' + type,
      pageParam: {
        name: 'index_detail_' + type,
        title: title
      },
      url: './first_header.html',
      delay: 200,
      bounces: false
    });
  }
  function openSuccess(title) {
    api.openWin({
      name: 'sqsb_succeed',
      pageParam: {
        name: 'sqsb_succeed',
        title: title
      },
      url: './first_header.html',
      delay: 200,
      bounces: false
    });
  }
    function goback () {
      api.closeWin({name:api.pageParam.name});
    }
</script>
</body>
</html>
